﻿<#import "../../_layout.ftl" as layout>
${Html.s("pagetitle","我的流程")}
<@layout._layout>
<!-- Latest compiled and minified CSS -->
<!-- 引入bootstrap样式 -->
 <link rel="stylesheet" href="/content/bootstrap/css/bootstrap.min.css" crossorigin="anonymous">
 <link rel="stylesheet" href="/content/bootstrap/bootstrap-table/bootstrap-table.min.css">
    

<!-- Latest compiled and minified JavaScript -->
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="/content/jquery/3.2.1/jquery.min.js"></script>
 
<!-- bootstrap.bundle.min.js 用于弹窗、提示、下拉菜单，包含了 popper.min.js -->
<script src="/content/popper/1.15.0/umd/popper.min.js"></script>

<script src="/content/bootstrap/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
<script src="/content/bootstrap/bootstrap-table/bootstrap-table.min.js"></script>
<!-- Latest compiled and minified Locales -->
<script src="/content/bootstrap/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<div class="head">
    <div class="title">
    ${pagetitle}
    </div>
</div>
<style>
.search-colum{
width:260px;
float:left;
display:block;
margin:3px;
}
.search-colum label{
width: 60px;
}
.clear{
clear:both;
}
table,td{
padding:3px;
}
</style>
<div class="orderlist m10 myorder">
    <form action="#" method="post" id="searchForm">
        <div class="search">
        	<div class="search-colum"> <label>流程ID</label><input type="text" class="text midtext" style="width:150px;" name="flowId"   id="flowId"/></div>
           	<div class="search-colum"> <label>流程标题</label><input type="text" class="text midtext" style="width:150px;" name="flowTitle" id="flowTitle"  /></div>
            <div class="search-colum"> <label>审批节点</label><input type="text" class="text midtext" style="width:150px;" name="approveNode"  id="approveNode"/></div>
            <div class="search-colum"> <label>审批人</label><input type="text" class="text midtext" style="width:150px;" name="flowApproveBy" id="approveBy"/></div>
            <div class="search-colum"> <label>发起人</label><input type="text" class="text midtext" style="width:150px;" name="createBy"  id="createBy" /></div>
            <div class="search-colum"> <label>任务状态</label><select name="taskSate" id="taskState" style="width:150px;">
                   	<option value="">全部</option>
                    <option value="1">草稿</option>
                    <option value="2">处理中</option>
                    <option value="3">已完成</option>
                    <option value="4">已关闭</option>
                    <option value="5">异常流程</option>
            </select></div>
             <div class="search-colum"> <input type="button" class="btn1" onclick="customSearch();" value="搜索" accesskey="" /></div>
            <div class="clear"></div>
          
        </div>
    </form>    
	<table id="table" data-id-field="id" class="table" width="98%">   
	</table>
 </div>
 <!-- 模态框（Modal） -->
<div class="modal fade" id="cancelModalDlg" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
	<form action="#" id="cancelForm">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title" id="myModalLabel">
					撤销流程
				</h4>
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
					&times;
				</button>
				
			</div>
			<div class="modal-body">
				
					<input type="hidden" id="hdflowId"/>
					撤销原因：<input type="text" id="iptCancelRemark" required="required"></input>
				
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭
				</button>
				<button type="submit" class="btn btn-primary">
					提交更改
				</button>
			</div>
			</form>
		</div><!-- /.modal-content -->
	</div><!-- /.modal -->
</div>
<script type="text/javascript">
	$(document).ready(function(){
		$('#table').bootstrapTable({	
			  ajax:ajaxRequest,	  	
		  	  sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
  			  pagination: true,
  			  //customSearch: customSearch,
  			  queryParamsType:'undefind',
  			  striped: true,//设置为 true 会有隔行变色效果
  			  toolbar: "#searchForm",//指定工具栏
  			  queryParams :queryParam ,
			  columns: [{
			    field: 'id',
			    title: 'ID'
			  }, {
			    field: 'title',
			    title: '流程标题'
			  }, {
			    field: 'approveNode',
			    title: '审批节点'
			  }, {
			    field: 'approveBy',
			    title: '审批人'
			  }, {
			    field: 'flowState',
			    title: '任务状态',
			    formatter:function(value, item, index) {
			        if (value==1) {
			            return '草稿';
			        } else if (value==2) {
			           return '处理中';
			        } else if (value==3) {
			           return '已完成';
			        } else if (value==4) {
			           return '已关闭';
				    } else if (value==5) {
			           return '异常流程';
			        }
			    }
			  }, {
			    field: 'updateTime',
			    title: '更新时间'
			  }, {
			    field: 'createTime',
			    title: '创建时间'
			  }, {
			    field: 'Button',
			    title: '操作',		
			    formatter:function(value,row,index){
			    	var button="";
			    	if(row.flowState==1&&row.modelType==1){
			    		button+='<a href="edit?flowid='+row.id+'">编辑</a>&nbsp;&nbsp;';
			    		button+='<a href="#" onclick="submitFlow('+row.id+');" id="btnSumbit">提交</a>&nbsp;&nbsp;';
			    		button+='<a href="#" onclick="deleteFlow('+row.id+');" id="btnSumbit">删除</a>&nbsp;&nbsp;';
			    	}
			    	if(row.flowState>1&&row.flowState<3&&row.modelType==1) {
			    		button+='<a href="#" onclick="cancelDlg('+row.id+');" id="btnCancel">撤销</a>&nbsp;&nbsp;';
			    	}
			    	if(row.flowState==4&&row.modelType==1) {
			    		button+='<a href="#" onclick="relaunch('+row.id+');" id="btnResubmit">重新提交</a>&nbsp;&nbsp;';
			    	}
			    	button+='<a href="/user/flow/flow_detail?flowid='+row.id+'"	id="TabledView">查看</a>&nbsp;&nbsp;';
			    	return button;
			    }
			  }]			
			});
	$("#cancelForm").submit(function(){
		var id=$("#hdflowId").val();
		var remark=$("#iptCancelRemark").val();
		
		if(id!="" && remark!="")
		{
			$.ajax({
				url:"cancelflow",
				type:"POST",
				dataType:"JSON",
				data:{
					"flowid":id,
					"userNo":${user.userno},
					"remark":remark
				},
				success:function(data){
					if(data.code==200000)
					{
						alert("撤销成功");						
					}
					$('#cancelModalDlg').modal("hide");
					customSearch();
				},
				error:function(err){
					alert("撤销失败："+err);
				}
				
			});
		}
		
		
	});
	});	
	function ajaxRequest(params) {
		$.ajax({
		 	url: '/user/flow/lunched_list',
		  	type:'POST',	
		  	dataType:"JSON",
		  	data:params.data,
		  	contentType: 'application/json',
		  	success:function(data){
		  		 params.success({"rows":data.data.data,"total":data.data.totalNum})
		  	
		  	},
		  	error:function(err){
		  		alert("加载数据失败");
		  	}
		});
	  			
	}
	function queryParam(params) {//上传服务器的参数
		var temp = {//如果是在服务器端实现分页，limit、offset这两个参数是必须的
				pageSize : params.pageSize, // 每页显示数量
				//pageIndex : params.offset, // SQL语句起始索引
				pageIndex: params.pageNumber,  //页码
	         	sortName:params.sortName,
	        	sortOrder:params.sortOrder,
	         	searchText:params.searchText,	 
				flowId : $("#flowId").val(),
				title : $("#flowTitle").val(),				
				approveNode : $("#flowApproveNode").val(),
				approveBy : $("#flowApproveBy").val(),
				flowState : $("#taskState").val(),	
				creatUserno:${user.userno}							
										
			};
		return JSON.stringify(temp);	
	}
	function clearfun(){
	   	 $('#flowId').val("");
	   	 $('#taskId').val("");
		 $('#flowApproveNode').val("");
		 $('#flowApproveBy').val("");
		 $('#taskState').val(0);						
		 $('#flowTitle').val("");		
    	 customSearch();

	}
	function customSearch(){
		$("#table").bootstrapTable('refresh');
	}  
	function cancelDlg(id)
	{
		$("#hdflowId").val(id);
		$('#cancelModalDlg').modal('show');
	}
	function deleteFlow(flowid)
	{
		$.ajax({
			url:"deleteFlow",
			type:"POST",
			dataType:"JSON",
			data:{
				"flowid":flowid,
				"userNo":${user.userno}	
			},
			success:function(){
				alert("提交成功!");
				window.location.reload();
			},
			error:function(e,d){
				alert("提交失败"+ d);
			}
			
		});
	}
	function submitFlow(flowId){
		$.ajax({
			url:"lunchflow",
			type:"POST",
			dataType:"JSON",
			data:{
				"flowid":flowId,
				"userNo":${user.userno}	
			},
			success:function(){
				alert("提交成功!");
				window.location.reload();
			},
			error:function(e,d){
				alert("提交失败"+ d);
			}
			
		});
	}
	function relaunch(flowId){
		$.ajax({
				url:"relaunch",
				type:"POST",
				dataType:"JSON",
				data:{
					"flowid":flowId,
					"userNo":${user.userno}					
				},
				success:function(data){
					if(data.code==200000)
					{
						alert("提交成功");	
						customSearch();					
					}					
					
				},
				error:function(err){
					alert("提交失败："+err);
				}
				
			});
	}
</script>
</@layout._layout>

  
  